<template>
   <view class="ping" @click="toer" v-if="show">
   	<view class="h2">
   		还差{{detail.assembleBuying.assembleNumbers*1 - detail.assembleBuying.purchasedProductQuantity*1}}人拼团成功，仅剩 {{times}}
   	</view>
   	<view class="pingk" v-if="false">
   		<view class="top">
   			<view class="kbox">
   				<view class="tito">
   					团长
   				</view>
   				<view class="topk">
   					<image src="/static/img/2/2-5.png" mode="scaleToFill"></image>
   				</view>
   			</view>
   			<view class="kbox">
   				<view class="topk">
   					<image src="/static/img/2/2-5.png" mode="scaleToFill"></image>
   				</view>
   			</view>
   		</view>
   		<view class="ps">
   			开团后可邀请好友
   		</view>
   		<view class="gank">
   
   			<view class="ga">
   				<image src="/static/img/1/face1.png" mode="widthFix"></image>
   				<text>{{detail.assembleBuying.successName}}</text>
   			</view>
   			<view class="bb"></view>
   			<view class="ga">
   				<image src="/static/img/1/face1.png" mode="widthFix"></image>
   			</view>
   			<view class="bb"></view>
   			<view class="ga">
   				<image src="/static/img/1/face1.png" mode="widthFix"></image>
   				<image src="/static/img/1/face2.png" mode="widthFix"></image>
   			</view>
   		</view>
   	</view>
   </view>
</template>

<script>
    export default {
        name: "",
        components:{
            
        },
        data(){
            return {
                 detail: {
                 	promotion: {
                 		sDesName: ''
                 	},
                 	assembleBuying: {
                 		
                 
                 	}
                 },
				 timer: null,
				 times: "--天--:--:--",
				 show:false
            }
        },
		methods:{
			setDatas(val){
				this.detail = val
				if(this.detail.assembleBuying){
					this.show = true
					this.timeDown()
				}
				
			},
			toer(){
				
			},
			timeDown() { // 倒计时
			
				clearInterval(this.timer);
				var starttime = new Date(this.detail.assembleBuying.startTime.replace(/-/g, "/")) / 1000;
				var nowDate = Math.round(new Date() / 1000); // 当前时间
				//var endtime = Number(this.initActiveMsgObj.end_time); 
				var endtime = new Date(this.detail.assembleBuying.endTime.replace(/-/g, "/")) / 1000;
				// endtime = Math.round(new Date('2019/7/10 14:56:00') / 1000); + 60;
				if (endtime < nowDate) {
					return
				}
			
			
				var totalSeconds = parseInt((endtime - nowDate)); // 相差的总秒数
				//天数
				var days = Math.floor(totalSeconds / (60 * 60 * 24));
				//取模（余数）
				var modulo = totalSeconds % (60 * 60 * 24);
				//小时数
				var hours = Math.floor(modulo / (60 * 60));
				hours = hours < 10 ? ('0' + hours) : hours;
				modulo = modulo % (60 * 60);
				//分钟
				var minutes = Math.floor(modulo / 60);
				minutes = minutes < 10 ? '0' + minutes : minutes;
				// console.log(minutes)
				//秒
				var seconds = modulo % 60;
				seconds = seconds < 10 ? '0' + seconds : seconds;
				// console.log(seconds);
				//输出到页面
				this.times = days + '天' + hours + ':' + minutes + ':' + seconds;
				// console.log(days + "天" + hours + "时" + minutes + "分");
				//if(totalSeconds <= 0){
				if (totalSeconds <= 60) {
					clearInterval(this.timer);
					// window.location.reload()
				} else {
					this.timer = setInterval(this.timeDown, 1000);
				}
			},
		}
      

    }
</script>

<style scoped lang="less">
	.pingk {
		padding: 30rpx;
		text-align: center;
	}
	
	.gank {
		width: calc(524rpx + 80rpx);
		margin: auto;
		font-size: 24rpx;
		font-family: Microsoft YaHei;
		font-weight: 400;
		color: rgba(240, 64, 111, 1);
		margin-top: 30rpx;
		position: relative;
		padding-bottom: 45rpx;
		/* line-height: 40rpx; */
	}
	
	.gank .ga {
		display: inline-block;
		position: relative;
		vertical-align: middle;
	
	}
	
	.gank .ga text {
		display: block;
		position: absolute;
		top: 50rpx;
		width: 100rpx;
		left: -30rpx;
		margin: auto;
	}
	
	.gank .bb {
		width: 220rpx;
		display: inline-block;
		height: 1px;
		background: #F0406F;
		vertical-align: middle;
	}
	
	/* .gank .ga:nth-child(1){
		text-align: left;
	}
	.gank .ga:nth-child(3){
		text-align: right;
	} */
	.gank image {
		display: inline-block;
		vertical-align: middle;
		width: 40rpx;
		height: 40rpx;
	}
	
	.pingk .ps {
		font-size: 24rpx;
		font-family: Microsoft YaHei;
		font-weight: 400;
		color: rgba(51, 51, 51, 1);
		margin-top: 15rpx;
	}
	
	.pingk .kbox {
		width: 105rpx;
		display: inline-block;
		vertical-align: bottom;
		margin-left: 7rpx;
		margin-right: 7rpx;
	}
	
	.pingk .kbox .tito {
		display: block;
		margin: auto;
		width: 56rpx;
		height: 23rpx;
		background: rgba(240, 64, 111, 1);
		border-radius: 12rpx;
		text-align: center;
		font-size: 20rpx;
		font-family: Microsoft YaHei;
		font-weight: 400;
		color: rgba(255, 255, 255, 1);
		line-height: 23rpx;
		margin-bottom: 10rpx;
	}
	
	.pingk .topk {
		display: block;
		vertical-align: middle;
		width: 105rpx;
		height: 105rpx;
		border: 1px dashed rgba(240, 64, 111, 1);
		border-radius: 50%;
		overflow: hidden;
	}
	
	.pingk .topk image {
		display: block;
		width: 100%;
	}
	
	.ping {
		margin-top: 10rpx;
		margin-bottom: 10rpx;
		background: #fff;
	}
	
	.ping .h2 {
		height: 60rpx;
		background: rgba(240, 64, 111, 1);
		text-align: center;
		font-size: 24rpx;
		font-family: Microsoft YaHei;
		font-weight: 400;
		color: rgba(255, 255, 255, 1);
		line-height: 60rpx;
	}
	
	.ping .h2 text {
		display: inline-block;
		width: 28rpx;
		height: 28rpx;
		background: rgba(255, 255, 255, 1);
		border-radius: 14rpx;
		text-align: center;
		line-height: 28rpx;
		font-size: 18rpx;
		color: #F0406F;
		margin-left: 5rpx;
	}
</style>
